<!DOCTYPE html>
<html>
<head lang="zh-cn">
    <link href="$!{__beat.server.contextPath}/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="$!{__beat.server.contextPath}/bootstrap/datepicker/datepicker3.css" rel="stylesheet">
    <link rel="stylesheet" href="$!{__beat.server.contextPath}/bootstrap/css/App.css" type="text/css" />
    <link rel="stylesheet" href="$!{__beat.server.contextPath}/bootstrap/css/font-awesome.min.css" type="text/css" />

    <link rel="stylesheet" type="text/css" href="$!{__beat.server.contextPath}/css/wnl.css">
    <meta charset="UTF-8">

    <title>访问路径-品类</title>
</head>
<body>

<div class="container-fluid">
    <div class="row" align="center" style="margin-bottom:8px; margin-top:5px;">
        <form class="form-inline" action="$!{__beat.server.contextPath}/netflow/visitPL" method="post">
            <div class="form-group" style="width:180px">
                <label for="businessName" style="padding-left:15px;">业务线：</label>
                <select id="businessName" name="businessName" class="form-control input-sm" style="align:center; width:100px; ">
                   #foreach($buss in $businessList)
                   #if($buss!='ershou')
	                        <option value="$buss" #if("$buss" == $!businessName) selected #end>$business_CN_Map.get("$buss")</option>
	                   #end
	               #end
                </select>
            </div>

            <div class="form-group" style="width:180px">
                <label for="cate">类 别：</label>
                <select id="cate" name="cate" class="form-control input-sm" style="align:center; width:100px; ">
                     #foreach($cate1 in $cate_name_list)
                 
                        <option value="$cate1" #if("$cate1" == $!cate) selected #end>#if($cate1=='all')全部#else$cate1#end</option>
                    #end
                </select>
            </div>
            <div class="form-group" style="width:180px">
                <label for="platform">平 台：</label>
                <select id="platform" name="platform" class="form-control input-sm" style="align:center; width:100px; ">
                        <option value="pc" #if("pc" == $!platform) selected #end>PC</option>
                        <option value="m"  #if("m" == $!platform) selected #end>M</option>
                        <option value="app" #if("app" == $!platform) selected #end>APP</option>
                </select>
            </div>
       
    </div>
 
     <div class="row col-md-offset-3"  style="margin-bottom:8px; margin-top:5px;">
        <div class="form-inline"  >
            <div class="form-group" style="width:180px">
                <label for="actionType" style="padding-left:15px;margin-left:-5px;">模 板：</label>
                <input id="action_type_text" type="hidden" value="$!actionType">
                <select id="actionType" name="actionType" class="form-control input-sm" style="align:center; width:100px; ">
                       <option value="all" >全部</option>
                </select>
            </div>
            <label for="stat_date" style="margin-left:-1px;">日 期：</label>
            <div class="form-group input-group input-group-sm" style="width: 13%;">
                <input id="stat_date" name="stat_date" type="text"  class="form-control input-sm time" placeholder="选择时间" data-date-end-date='-1d' value="$!stat_date"/>
            </div>
            <div class="form-group sea_btn">
                      <select id="plat" name="plat" class="form-control input-sm" style="width:100px;margin-left:50px;">
                          <option value="pv" #if($!plat=='pv') selected #end>PV</option>
                          <option value="uv" #if($!plat=='uv') selected #end>UV</option>
                      </select>
                      <input type="submit" value="查询" class="btn btn-primary btn-xs">
                  </div>    
             </div>      
        </form>
    </div>
  
      
    <div class="dataconWrap">
        <div class="datacontent" id="qsContent">
            <div  id="s1">

            </div>
        </div>
        <div class="explainMain">
            <img src="$!{__beat.server.contextPath}/image/exPic.png" alt="">
            <dl>
                <dt>
                    <i class="mark"></i><span>区域说明</span>
                </dt>
                <!-- <div class="dataTit"><i class="mark"></i><span>访问路径</span></div> -->
                <dd>A. 每层路径的数据块区域</dd>
                <dd>B. 本层路径页面类型，包括：</dd>
                <dd>
                    <span class="home">home:首页</span>
                    <span class="list">list:列表页</span>
                    <span class="index">index:大类页</span>
                    <span class="detail">detail:详情页</span>
                    <span class="qy_detail">qy_detail:企业详情页</span>
                    <span class="post">post:发布页</span>
                    <span class="end">end:离开</span>
                    <span class="jianli_detail">jianli_detail:简历详情页</span>
                    <span class="vip">vip:vip中心</span>
                    <span class="my">my:我的个人中心</span>
                    <span class="others">others:其他业务类型页面</span>
                    <span class="other_biz">other_biz:其他业务线</span>
                    <span class="empty">empty:空页面类型</span>
                    <span class="login">login:登录页</span>
                    <span class="deliver">deliver:投递页</span>
                </dd>
                <dd>C. detail页面PV占home>list>所有页面类型的PV的比例</dd>
                <dd>D. detail页面PV占home>list中list页面PV的比例</dd>
                <dd>E. home>list>detail路径中detail页面类型PV</dd>
                <dd>F. detail页面PV占所有第三层路径PV的比例</dd>
                <dt>
                    <i class="mark"></i><span>旭日图怎么看</span>
                </dt>
                <dd>由内之外,分别是落地页,落地页下一步路径页面...</dd>
                <dt>
                    <i class="mark"></i><span>路径建立前提</span>
                </dt>
                <dd>1、路径采用用户唯一标识,页面唯一标识进行串联</dd>
                <dd>2、落地页:所有在会话内找不到来源页面的均算作落地页。</dd>
            </dl>
        </div>
    </div>

</div>
</body>
<script src="$!{__beat.server.contextPath}/bootstrap/jquery.js"></script>
<script src="$!{__beat.server.contextPath}/bootstrap/js/libs/bootstrap.js"></script>
<script src="$!{__beat.server.contextPath}/bootstrap/datepicker/bootstrap-datepicker.js"></script>
<script src="$!{__beat.server.contextPath}/bootstrap/datepicker/nongLiDate.js"></script>
<script src="$!{__beat.server.contextPath}/bootstrap/datepicker/locales/bootstrap-datepicker.zh-CN.js"></script>
<script src="$!{__beat.server.contextPath}/bootstrap/js/App.js"></script>
<script src="$!{__beat.server.contextPath}/js/visit_path/d3.v3.js"></script>
<link rel="stylesheet" type="text/css" href="$!{__beat.server.contextPath}/js/visit_path/visit_path.css"/>
<script type="text/javascript" src="$!{__beat.server.contextPath}/js/visit_path/visit_path.js"></script>
<script type="text/javascript">
    var businessName = "$!{businessName}";
    var dayMap={1:"周一",2:"周二",3:"周三",4:"周四",5:"周五",6:"周六",0:"周日"};
	var datepicker_op={
        format: "yyyy-mm-dd",
        clearBtn: false,
        language: "zh-CN",
        autoclose: true,
        todayHighlight: true,
        minViewMode:0,
		orientation: "top left"
    };
    $('#stat_date').datepicker(datepicker_op);

    //获取星期几 dayDate 的格式为 yyyy-MM-dd
    function getWeekDay(dayDate){
        var jsDate = new Date(Date.parse(dayDate.replace(/\-/g,'/')));
        var weekNumber = jsDate.getDay();
        return dayMap[weekNumber];
    }
    
    $("#platform").change(function(){
  	  var text = $(this).val();
  	  if(text=='m'){
  		  var option = '<option value="all">全部</option><option value="momoclient">momoclient</option><option value="m_zhuzhan">m_zhuzhan</option><option value="qqclient">qqclient</option><option value="tongchengbao">tongchengbao</option>';
  	  }else{
  		  var option = '<option value="all">全部</option>';
  	  }
  	  $("#actionType").empty();
  	  $("#actionType").append(option);
  });
    
    $("#businessName").change(function(){
    	 var businessName = $("#businessName").val();
    	 $.ajax({
             url: '/dashboard/netflow/ajax/visit_pathcate',
             type: 'POST',
             async: true,
             data:{"businessName":businessName},
             dataType: 'json',
             success: function(data, textStatus) {
                 $("#cate").empty();
                 var option_all = '';
                 var option = '';
                 $.each(data.cate,function(index,value){
                	  if(value=='all'){
                		  option_all = '<option value="all">全部</option>';
                		  return true;
                	  }
                	  option += '<option value="'+value+'">'+value+'</option>';
                 });
                 option = option_all + option;
                 $("#cate").append(option);
             },
             error : function() {
                   alert('error!');
               }
       });
    });

    function show(){
        var businessName = $('#businessName').val();
        var platform = $('#platform').val();
        var cate_name=$('#cate').val();
        var actionType=$('#actionType').val();
        var plat=$('#plat').val();
        var stat_date=$('#stat_date').val();
        
        if(platform=='m'){
        	var text = $("#action_type_text").get(0).value;
        	var option = '<option value="momoclient">momoclient</option><option value="m_zhuzhan">m_zhuzhan</option><option value="qqclient">qqclient</option><option value="tongchengbao">tongchengbao</option>';
            $("#actionType").append(option);
            $("#actionType").children().each(function(){
            	 if($(this).text()==text){
            		 this.selected = true;
            	 }
            });
        }
        
        $.ajax({
              url: '/dashboard/netflow/ajax/visit_pathNew',
              type: 'POST',
              async: true,
              data:{"businessName":businessName, "platform":platform, "stat_date":stat_date,"cate_name":cate_name,"actionType":actionType,"plat":plat,"option":"cate_name"},
              dataType: 'json',
              success: function(data, textStatus) {
                initNew('访问路径',data);
              },
              error : function() {
                    alert('error!');
                }
        });
    }
    $(function(){
        show();
    });
</script>
</html>